@splitter-width: 4px;

// automatically imported using grunt wiredep task. Do not add or remove
// anything between comments below
// bower:css
@import (less) "../bower_components/angular-ui-layout/ui-layout.css";
@import (less) "../bower_components/json-formatter/dist/json-formatter.css";
@import (less) "../bower_components/json-formatter-js/dist/style.css";
@import (less) "../bower_components/json-schema-view-js/dist/style.css";
@import (less) "../bower_components/source-code-pro/source-code-pro.css";
// endbower

// bower:less
@import "../bower_components/bootstrap/less/bootstrap.less";
@import "../bower_components/font-awesome/less/font-awesome.less";
// endbower

@import "fonts";
@import "buttons";
@import "components";
@import "markdown";
@import "print";

html, body {
  height: 100%;
  font-family: sans-serif;
}


/*
  Layout
*/
main {
  position: fixed;
  top: 30px;
  bottom: 0;
  right: 0;
  left: 0;

  .ui-splitbar {
    // TODO: design review the color
    background: #5E696B;
  }

  .pane.editor {
    >div, .editor-wrapper {
      height: 100%;
    }
  }

  &.preview-wrapper, .preview-wrapper {
    overflow: auto;
    margin: .5em 1em;
  }

  &.dragover {
    .file-drag {
      display: flex;
    }
  }

  .file-drag {
    display: none;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: lightgray;
    z-index: 10000;
    align-items: center;

    .dash {
      border: 10px dashed #138BC4;
      border-radius: 30px;
      width: 60%;
      height: 40%;
      margin: auto;
      display: flex;

      p {
        margin: auto;
        font-size: 50px;
        font-weight: 100;
      }
    }
  }
}

/*
 Reset
*/
a {
  cursor: pointer;
}
